<template>
	<view>
		<u-toast ref="uToast" />
		<view v-if="show" class="loading_view" style="padding:220rpx 0;">
		  <u-loading mode="circle" size="50"></u-loading>
		  <view class="messgae">
			加载中...
		  </view>
		 </view>
		<view class='a_list' v-else>
			<view class="list" v-for="(v,k) in list" :key="k" @click='onNav' :data-id="v.a_id">
				<view class="img">
					<image :src='v.a_icon'></image>
				</view>
				<view class="info">
					<view class='title'>
						{{v.a_name}}
					</view>
					<view class='bot'>
						<view class='sign'>已有{{v.a_participateNum}}人报名</view>
						<view class='status'>
							<text :class="v.a_status>2?'end':'start'">{{status[v.a_status]}}</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view v-if="showError!=''" class='empty'>
			<u-loading mode="circle" v-if='load' size="50"></u-loading>
			<text>{{showError}}</text>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				page:1,
				allpage:1,
				list:[],
				show:true,
				load:false,
				showError:'',
				status:['报名中','已截止','进行中','已结束']
			}
		},onLoad(){
			this.onList(1);
		},onReachBottom(){
			var page=this.page;
			
			if(page<this.allpage){
				this.load=true;
				
				this.showError='加载中...'
				
				page++;
			}else{
				this.showError='暂无更多活动了~';
				return;
			}
			
			this.onList(page);
		},
		onPullDownRefresh() {
			this.show=true;
			
			this.showError='';
			
			this.list=[];
			
			this.onList(1);
		},methods:{
			onNav(e){
				var id=e.currentTarget.dataset.id;
				
				uni.navigateTo({
				    url: '/pages/activity/activityView?id='+id
				});
			},
			onList(page=1){
				var that=this;
				
				this.$request({
					url:'/activity/index',
					data:{page:page},
					success(res){
						if(res.data.code==1){
							that.page=res.data.data.page;
							
							that.allpage=res.data.data.allpage;
							
							let list=res.data.data.list;
							
							for(var i in list){
								that.list.push(list[i]);
							}
							
							that.show=false;
							
							that.load=false
							
							that.showError='';
							
							if(that.page>=that.allpage){
								that.showError='暂无更多活动了~'
							}
							
							uni.stopPullDownRefresh()
						}else{
							that.$refs.uToast.show({
								title: res.data.msg,
								type:'error'
							})
						}
					},fail(){
						that.$refs.uToast.show({
							title: '网络繁忙',
							type: 'warning'
						})
					}
				})
			}
		}
	}
</script>

<style src="../../static/css/activity.css" scoped>
</style>
